import React, { Component } from "react";
import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
import { Layout, Card, Row, Col, Input, message, Icon, Carousel, List, Rate, Alert, Modal } from "antd";
import { Picker, List as MobileList } from 'antd-mobile';
import { getAccessTokenForOpenId, getSafetySceneById, getSafetySceneDeal } from "../js/wechatapi.js";
import {
    getProcessOpinions, addProcessOpinions, getSignature, getSafetySceneListForMessagePush,
    updateSafetySceneStatus, getWeChatPushUserBySafetySceneId, sendMessage,
} from "../js/dangerpushapi.js";
import { UrlPrefix, iconFontUrl } from "../js/config.js";

const IconFont = Icon.createFromIconfontCN({
    scriptUrl: iconFontUrl
});
const { Content } = Layout;

const WX = require("jweixin-wechat");

class DangerPush extends Component {

    componentDidMount() {
        getSignature(window.location.href)
            .then(res => {
                WX.config({
                    debug: false, //开启debug模式，在验证签名过程中会返回对应信息
                    appId: res.data.appid,
                    signature: res.data.signature,
                    nonceStr: res.data.noncestr,
                    timestamp: res.data.timestamp,
                    jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage']// 必填，需要使用的JS接口列表
                });
            })
            .catch((e) => {
                if (e.response) {
                    //请求已发出，服务器返回状态码不是2xx。
                    console.info(e.response.data)
                    console.info(e.response.status)
                    console.info(e.response.headers)
                } else if (e.request) {
                    // 请求已发出，但没有收到响应
                    // e.request 在浏览器里是一个XMLHttpRequest实例，
                    // 在node中是一个http.ClientRequest实例
                    console.info(e.request)
                } else {
                    //发送请求时异常，捕捉到错误
                    console.info('error', e.message)
                }
                console.info(e.config)
            });

        let urlData = this.getUrlParam("state");
        WX.ready(function () {
            var obj = {
                title: '隐患详情', // 分享标题
                desc: '点击查看隐患详情！', // 分享描述
                link: 'https://tidukeji.cn/dangerpush3/index.html?state=' + urlData, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
                // 该链接是重定向链接，因为需要获取用户code，但是该链接又无法直接写微信获取code的链接，
                // 所以需要点击后重新加载新的页面，来实现重定向，重新打开获取code的微信链接，实现获取用户信息的功能；
                imgUrl: 'https://tidukeji.cn/img/loginIcon.png', // 分享图标
                fail: function (res) {
                    console.log(JSON.stringify(res));
                }
            };
            // 2.1 监听“分享给朋友”，按钮点击、自定义分享内容及分享结果接口
            WX.onMenuShareAppMessage(obj);

            // 2.2 监听“分享到朋友圈”按钮点击、自定义分享内容及分享结果接口
            WX.onMenuShareTimeline(obj);
        })
    }

    getUrlParam(name) {
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
        var r = window.location.search.substr(1).match(reg);  //匹配目标参数
        if (r != null) return unescape(r[2]);
        return null; //返回参数值
    }

    render() {
        return (
            <Router>
                <Layout
                    style={{
                        backgroundColor: '#f5f5f5',
                        height: "100%"
                    }}>
                    <Content style={{ height: "100%" }}>
                        <Switch>
                            <Route path="/success" component={Success} />
                            {/*巡检员的推送页面*/}
                            <Route path="/" component={IndexPage} />
                            {/*安监主任的推送页面*/}
                            {/* <Route path="/" component={Page} /> */}
                        </Switch>
                    </Content>
                </Layout>
            </Router>
        );
    }
}

class Page extends Component {
    constructor(props) {
        super(props);
        this.state = {
            currentPage: 0,
            safetySceneId: 0,
            safetySceneList: [],
            safetySceneListAlready: []
        }
    }

    componentDidMount() {
        let urlData = this.getUrlParam("state"); //safetysceneid
        // 未提交处理意见
        getSafetySceneListForMessagePush(urlData, 0)
            .then(res => {
                this.setState({
                    safetySceneList: res.data
                })
            })
            .catch((e) => {
                if (e.response) {
                    //请求已发出，服务器返回状态码不是2xx。
                    console.info(e.response.data)
                    console.info(e.response.status)
                    console.info(e.response.headers)
                } else if (e.request) {
                    // 请求已发出，但没有收到响应
                    // e.request 在浏览器里是一个XMLHttpRequest实例，
                    // 在node中是一个http.ClientRequest实例
                    console.info(e.request)
                } else {
                    //发送请求时异常，捕捉到错误
                    console.info('error', e.message)
                }
                console.info(e.config)
            });
        // 已提交处理意见
        getSafetySceneListForMessagePush(urlData, 1)
            .then(res => {
                this.setState({
                    safetySceneListAlready: res.data
                })
            })
            .catch((e) => {
                if (e.response) {
                    //请求已发出，服务器返回状态码不是2xx。
                    console.info(e.response.data)
                    console.info(e.response.status)
                    console.info(e.response.headers)
                } else if (e.request) {
                    // 请求已发出，但没有收到响应
                    // e.request 在浏览器里是一个XMLHttpRequest实例，
                    // 在node中是一个http.ClientRequest实例
                    console.info(e.request)
                } else {
                    //发送请求时异常，捕捉到错误
                    console.info('error', e.message)
                }
                console.info(e.config)
            });
    }

    getUrlParam(name) {
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
        var r = window.location.search.substr(1).match(reg);  //匹配目标参数
        if (r != null) return unescape(r[2]);
        return null; //返回参数值
    }

    switcTabsOnClickHandle = (cur) => {
        this.setState({
            currentPage: cur
        })
        this.carousel.goTo(cur);
    }

    CarouselAfterChangeHandle = (cur) => {
        this.setState({
            currentPage: cur
        })
    }

    cardOnClickHandle = (safetySceneId) => {
        this.setState({
            currentPage: 0,
            safetySceneId: safetySceneId
        })
        this.carousel.goTo(0);
    }

    render() {
        return (
            <div style={{
                height: "100%"
            }}>
                <Row className="swiper-tab">
                    <Col
                        className={this.state.currentPage === 0 ? "swiper-tab-list on" : "swiper-tab-list"}
                        onClick={() => this.switcTabsOnClickHandle(0)}
                    >
                        <text>正在查看</text>
                    </Col>
                    <Col
                        className={this.state.currentPage === 1 ? "swiper-tab-list on" : "swiper-tab-list"}
                        onClick={() => this.switcTabsOnClickHandle(1)}
                    >
                        <text>未提交</text>
                    </Col>
                    <Col
                        className={this.state.currentPage === 2 ? "swiper-tab-list on" : "swiper-tab-list"}
                        onClick={() => this.switcTabsOnClickHandle(2)}
                    >
                        <text>已提交</text>
                    </Col>
                </Row>
                <Row
                    className="my-carousel"
                    style={{
                        paddingTop: "6vh"
                    }}>
                    <Carousel
                        className="my-carousel"
                        ref={carousel => (this.carousel = carousel)}
                        dots={false}
                        infinite={false}
                        afterChange={(current) => this.CarouselAfterChangeHandle(current)}>
                        <div>
                            {
                                this.state.currentPage === 0 ?
                                    (
                                        <IndexPage safetySceneId={this.state.safetySceneId}></IndexPage>
                                    ) :
                                    (
                                        null
                                    )
                            }
                        </div>
                        <div>
                            {
                                this.state.safetySceneList.length === 0 ?
                                    (
                                        <Row
                                            style={{
                                                height: "90vh",
                                                display: "flex",
                                                justifyContent: "center",
                                                alignItems: "center"
                                            }}>
                                            <img class='no-data-img' src={require('../img/nodata.png')}></img>
                                        </Row>
                                    ) :
                                    (
                                        this.state.currentPage === 1 ?
                                            (
                                                <List
                                                    itemLayout="horizontal"
                                                    dataSource={this.state.safetySceneList}
                                                    renderItem=
                                                    {
                                                        item =>
                                                            (
                                                                <SafetySceneCard data={JSON.stringify(item)} cardOnClickHandle={(safetySceneId) => this.cardOnClickHandle(safetySceneId)} />
                                                            )
                                                    }
                                                />
                                            ) :
                                            (
                                                null
                                            )
                                    )
                            }
                            <Row style={{
                                display: "flex",
                                justifyContent: "center",
                                alignItems: "flex-end"
                            }}>
                                仅显示近3日消息
                            </Row>
                        </div>
                        <div>
                            {
                                this.state.safetySceneListAlready.length === 0 ?
                                    (
                                        <Row
                                            style={{
                                                height: "90vh",
                                                display: "flex",
                                                justifyContent: "center",
                                                alignItems: "center"
                                            }}>
                                            <img class='no-data-img' src={require('../img/nodata.png')}></img>
                                        </Row>
                                    ) :
                                    (
                                        this.state.currentPage === 2 ?
                                            (
                                                <List
                                                    itemLayout="horizontal"
                                                    dataSource={this.state.safetySceneListAlready}
                                                    renderItem=
                                                    {
                                                        item =>
                                                            (
                                                                <SafetySceneCard data={JSON.stringify(item)} cardOnClickHandle={(safetySceneId) => this.cardOnClickHandle(safetySceneId)} />
                                                            )
                                                    }
                                                />
                                            ) :
                                            (
                                                null
                                            )
                                    )
                            }
                            <Row style={{
                                display: "flex",
                                justifyContent: "center",
                                alignItems: "flex-end"
                            }}>
                                仅显示近3日消息
                            </Row>
                        </div>
                    </Carousel>
                </Row>
            </div>
        );
    }
}

class SafetySceneCard extends Component {
    constructor(props) {
        super(props);
        this.state = {
            data: JSON.parse(props.data)
        }
    }

    componentWillReceiveProps(props) {
        this.setState({
            data: JSON.parse(props.data)
        })
    }

    render() {
        return (
            <Row>
                <Card
                    className="mycard safetylist"
                    bordered={false}>
                    <Row type="flex" justify="space-between" algin="middle">
                        <Col className="safetylist">
                            <div className="safe-title">
                                {this.state.data.categoryName}隐患
                            </div>
                            <img className="safetyLevel-tag" src={require("../img/safetyLevel" + this.state.data.safetyLevel + ".png")} />
                        </Col>
                        {
                            this.state.data.status === 0 ?
                                (
                                    <Col className="safetylist">
                                        <div className="mywechat-btn" onClick={() => { this.props.cardOnClickHandle(this.state.data.id) }}>处理意见</div>
                                    </Col>
                                ) :
                                (
                                    null
                                )
                        }
                    </Row>
                    <Row className="mytitle-text" style={{ fontWeight: "bold" }}>上报时间：
                        <span style={{ fontWeight: "normal" }}>{this.state.data.createTime}</span>
                    </Row>
                    <Row className="card-item-box">
                        <Col>
                            <Row className="card-flex">
                                <span className="card-item-title">地点：</span>
                                <span className="card-item-text">{this.state.data.address}</span>
                            </Row>
                            <Row className="card-flex">
                                <span className="card-item-title">上报人：</span>
                                <span className="card-item-text">{this.state.data.reportName}</span>
                            </Row>
                            <Row className="card-flex">
                                <span className="card-item-title">现场情况：</span>
                                <span className="card-item-text">{this.state.data.content}</span>
                            </Row>
                        </Col>
                        <Col>
                            {
                                this.state.data.photo !== "" ?
                                    (
                                        <img className="safetylist-img" src={UrlPrefix + this.state.data.photo.split(',')[0]} />
                                    ) :
                                    (
                                        <img className="safetylist-img" src={require('../img/nophoto.png')} />
                                    )
                            }

                        </Col>
                    </Row>
                </Card>
            </Row>
        );
    }
}
const { TextArea } = Input;
class IndexPage extends Component {
    constructor(props) {
        super(props);
        this.state = {
            loading1: false,
            loading2: false,
            loading3: false,
            loading4: false,
            safetySceneData: null,
            opinionData: null,
            safetySceneDealData: null,
            opinion: "",
            safetySceneId: props.safetySceneId === undefined ? 0 : props.safetySceneId,
            pushUser: [],
            isSendMessage: false
        };

    }

    componentDidMount() {
        if (this.state.safetySceneId === 0) {
            let urlData = this.getUrlParam("state"); //safetysceneid
            this.setState({
                safetySceneId: urlData
            })
            this.refreshData(urlData);
        } else {
            this.refreshData(this.state.safetySceneId);
        }
        getSignature(window.location.href)
            .then(res => {
                WX.config({
                    debug: false, //开启debug模式，在验证签名过程中会返回对应信息
                    appId: res.data.appid,
                    signature: res.data.signature,
                    nonceStr: res.data.noncestr,
                    timestamp: res.data.timestamp,
                    jsApiList: ['previewImage']
                });
            })
            .catch((e) => {
                if (e.response) {
                    //请求已发出，服务器返回状态码不是2xx。
                    console.info(e.response.data)
                    console.info(e.response.status)
                    console.info(e.response.headers)
                } else if (e.request) {
                    // 请求已发出，但没有收到响应
                    // e.request 在浏览器里是一个XMLHttpRequest实例，
                    // 在node中是一个http.ClientRequest实例
                    console.info(e.request)
                } else {
                    //发送请求时异常，捕捉到错误
                    console.info('error', e.message)
                }
                console.info(e.config)
            });
    }

    componentWillReceiveProps(props) {
        if (props.safetySceneId !== 0) {
            this.setState({
                safetySceneId: props.safetySceneId
            });
            this.refreshData(props.safetySceneId);
        }
    }

    refreshData(safetySceneId) {
        // let urlData = 1; //测试数据
        this.setState({
            loading1: true,
            loading2: true,
            loading3: true,
            loading4: true,
        });
        getSafetySceneById(safetySceneId)
            .then(res => {
                this.setState({
                    safetySceneData: res.data,
                    loading1: false
                });
            })
            .catch((e) => {
                if (e.response) {
                    //请求已发出，服务器返回状态码不是2xx。
                    console.info(e.response.data)
                    console.info(e.response.status)
                    console.info(e.response.headers)
                } else if (e.request) {
                    // 请求已发出，但没有收到响应
                    // e.request 在浏览器里是一个XMLHttpRequest实例，
                    // 在node中是一个http.ClientRequest实例
                    console.info(e.request)
                } else {
                    //发送请求时异常，捕捉到错误
                    console.info('error', e.message)
                }
                console.info(e.config)
            });
        getProcessOpinions(safetySceneId)
            .then(res => {
                if (res.data !== "") {
                    this.setState({
                        opinionData: res.data
                    });
                }
                this.setState({
                    loading2: false
                });
            })
            .catch((e) => {
                if (e.response) {
                    //请求已发出，服务器返回状态码不是2xx。
                    console.info(e.response.data)
                    console.info(e.response.status)
                    console.info(e.response.headers)
                } else if (e.request) {
                    // 请求已发出，但没有收到响应
                    // e.request 在浏览器里是一个XMLHttpRequest实例，
                    // 在node中是一个http.ClientRequest实例
                    console.info(e.request)
                } else {
                    //发送请求时异常，捕捉到错误
                    console.info('error', e.message)
                }
                console.info(e.config)
            });
        getSafetySceneDeal(safetySceneId)
            .then(res => {
                if (res.data !== "") {
                    this.setState({
                        safetySceneDealData: res.data,
                    });
                }
                this.setState({
                    loading3: false
                });
            })
            .catch((e) => {
                if (e.response) {
                    //请求已发出，服务器返回状态码不是2xx。
                    console.info(e.response.data)
                    console.info(e.response.status)
                    console.info(e.response.headers)
                } else if (e.request) {
                    // 请求已发出，但没有收到响应
                    // e.request 在浏览器里是一个XMLHttpRequest实例，
                    // 在node中是一个http.ClientRequest实例
                    console.info(e.request)
                } else {
                    //发送请求时异常，捕捉到错误
                    console.info('error', e.message)
                }
                console.info(e.config)
            });
        getWeChatPushUserBySafetySceneId(safetySceneId)
            .then(res => {
                this.setState({
                    pushUser: res.data,
                    loading4: false,
                })
            })
    }

    getUrlParam(name) {
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
        var r = window.location.search.substr(1).match(reg);  //匹配目标参数
        if (r != null) return unescape(r[2]);
        return null; //返回参数值
    }

    imgOnClickHandle = (obj, current) => {
        WX.ready(() => {
            WX.previewImage({
                current: UrlPrefix + obj.split(",")[current],
                urls: obj.split(",").map(val => UrlPrefix + val) //需要预览的图片http链接列表
            });
        });
    }

    inputChangeHandle = (event) => {
        if (event && event.target && event.target.value) {
            let value = event.target.value;
            this.setState({
                opinion: value
            });
        }
    }

    submitClickHandle = () => {
        let code = this.getUrlParam("code");
        getAccessTokenForOpenId(code)
            .then(res => {
                // let urlData = 1; //测试数据
                let openId = res.data.openid;
                // let openId = "oiJGu4vlrDCbUWB9619N40DGo08w"; //测试数据
                addProcessOpinions(openId, this.state.safetySceneId, this.state.opinion)
                    .then(res => {
                        if (res.data === "success") {
                            this.props.history.push('/success')
                        } else if (res.data === "EXIST") {
                            message.error("已有其他人提交处理意见，您无需再提交！");
                            this.refreshData();
                        } else {
                            message.error("提交处理意见失败！");
                        }
                    })
                    .catch((e) => {
                        if (e.response) {
                            //请求已发出，服务器返回状态码不是2xx。
                            console.info(e.response.data)
                            console.info(e.response.status)
                            console.info(e.response.headers)
                        } else if (e.request) {
                            // 请求已发出，但没有收到响应
                            // e.request 在浏览器里是一个XMLHttpRequest实例，
                            // 在node中是一个http.ClientRequest实例
                            console.info(e.request)
                        } else {
                            //发送请求时异常，捕捉到错误
                            console.info('error', e.message)
                        }
                        console.info(e.config)
                    });
            })
            .catch((e) => {
                if (e.response) {
                    //请求已发出，服务器返回状态码不是2xx。
                    console.info(e.response.data)
                    console.info(e.response.status)
                    console.info(e.response.headers)
                } else if (e.request) {
                    // 请求已发出，但没有收到响应
                    // e.request 在浏览器里是一个XMLHttpRequest实例，
                    // 在node中是一个http.ClientRequest实例
                    console.info(e.request)
                } else {
                    //发送请求时异常，捕捉到错误
                    console.info('error', e.message)
                }
                console.info(e.config)
            });
    }

    handleChangeStatus = () => {
        updateSafetySceneStatus(this.state.safetySceneId).then((res) => {
            if (res.data === 'success') {
                message.success('操作成功！')
                this.refreshData(this.state.safetySceneId);
            } else {
                message.error('出现错误！')
            }
        })
    }

    handeleSendMessage = (touser) => {
        touser = touser.split(' ');
        Modal.confirm({
            title: `确定将隐患处理转发给${touser[1]}？`,
            className: 'mobileModal',
            onOk() {
                sendMessage(
                    touser[0],
                    this.state.safetySceneId,
                    this.state.safetySceneData.reportName,
                    this.state.safetySceneData.createTime,
                    this.state.safetySceneData.categoryName
                ).then(res => {
                    if (res.data.errmsg === "ok") {
                        message.success('操作成功！')
                        this.setState({
                            isSendMessage: true
                        })
                    } else {
                        message.error('出现错误！')
                    }
                })
            },
            okText: '确定',
            cancelText: '取消',
            okButtonProps: {
                style: { width: '45%', height: 40 }
            },
            cancelButtonProps: {
                style: { width: '45%', height: 40 }
            },
        })
    }

    render() {
        let img = this.state.safetySceneData !== null && this.state.safetySceneData.photo !== "" ? this.state.safetySceneData.photo.split(",").map((val, index) => {
            return (
                <Col className="img-container" onClick={() => this.imgOnClickHandle(this.state.safetySceneData.photo, index)}>
                    <img className="myweui-uploader__img" src={UrlPrefix + val} />
                </Col>
            );
        }) : [];
        let dealImg = this.state.safetySceneDealData !== null && this.state.safetySceneDealData !== "" && this.state.safetySceneDealData.dealPhoto !== "" && this.state.safetySceneDealData.dealPhoto !== null ? this.state.safetySceneDealData.dealPhoto.split(",").map((val, index) => {
            return (
                <Col className="img-container" onClick={() => this.imgOnClickHandle(this.state.safetySceneDealData.dealPhoto, index)}>
                    <img className="myweui-uploader__img" src={UrlPrefix + val} />
                </Col>
            );
        }) : [];

        let statusTag = null;
        if (this.state.safetySceneData === null) {
            statusTag = require("../img/undeal.png")
        } else {
            if (this.state.safetySceneData.status === 6) {
                statusTag = require("../img/undeal.png")
            } else if (this.state.safetySceneData.status === 5) {
                statusTag = require("../img/deal.png")
            } else if (this.state.safetySceneData.status === 7) {
                statusTag = require("../img/dealing.png")
            }
        }

        let pushUser = this.state.pushUser.map(item => {
            return {
                label: item.identityString,
                value: item.identityString,
                children: item.userList.map(itemitem => {
                    return {
                        label: itemitem.realName,
                        value: itemitem.weChatIdForSendMsg + ' ' + itemitem.realName,
                    }
                })
            }
        })

        return (
            <Row>
                <Card
                    className="mycard"
                    bordered={false}
                    loading={this.state.loading1 || this.state.loading2 || this.state.loading3 || this.state.loading4}>
                    <img className="card-status-right" src={statusTag} />
                    <Row className="card-title">
                        <Col className="text">
                            {this.state.safetySceneData !== null ? this.state.safetySceneData.categoryName : null}隐患
                        </Col>
                    </Row>
                    <Row className="card-txt">
                        <Col style={{ margin: 'auto 0' }}>
                            <img className="dot" src={require("../img/dot.png")} />
                        </Col>
                        <Col className="cell-padding">
                            隐患地点：</Col>{this.state.safetySceneData !== null ? this.state.safetySceneData.address : null}
                    </Row>
                    <Row className="card-txt">
                        <Col style={{ margin: 'auto 0' }}>
                            <img className="dot" src={require("../img/dot.png")} />
                        </Col>
                        <Col className="cell-padding">
                            上报人：</Col>{this.state.safetySceneData !== null ? this.state.safetySceneData.reportName : null}
                    </Row>
                    <Row className="card-txt">
                        <Col style={{ margin: 'auto 0' }}>
                            <img className="dot" src={require("../img/dot.png")} />
                        </Col>
                        <Col className="cell-padding">
                            上报时间：</Col>{this.state.safetySceneData !== null ? this.state.safetySceneData.createTime : null}
                    </Row>
                    <Row className="card-txt">
                        <Col style={{ margin: 'auto 0' }}>
                            <img className="dot" src={require("../img/dot.png")} />
                        </Col>
                        <Col className="cell-padding">
                            上报情况：</Col>
                    </Row>
                    <Row className="record-item-box">
                        <Row className="box-title-line box-title">详细问题</Row>
                        <Row className="cell-border">
                            <Row className="weui-cell">
                                <Row className="weui-cell__bd" style={{ width: "100%", overflow: "hidden", wordBreak: "break-all" }}>
                                    {this.state.safetySceneData !== null ? this.state.safetySceneData.content : null}
                                </Row>
                            </Row>
                        </Row>
                        <Row className="box-title-line box-title">现场照片</Row>
                        <Row className="background">
                            <Row className="box-image">
                                {img.length !== 0 ?
                                    img :
                                    (
                                        <Col className="img-container">
                                            <img className="myweui-uploader__img" src={require("../img/nophoto.png")} />
                                        </Col>
                                    )
                                }
                            </Row>
                        </Row>
                    </Row>
                    {
                        this.state.opinionData !== null ?
                            (
                                <Row>
                                    <Row className="card-txt">
                                        <Col style={{ margin: 'auto 0' }}>
                                            <img className="dot" src={require("../img/dot.png")} />
                                        </Col>
                                        <Col className="cell-padding">
                                            处理意见：</Col>
                                    </Row>
                                    <Row className="record-item-box deal-item-box">
                                        <Row className="box-title-line box-title">提出人</Row>
                                        <Row className="cell-border">
                                            <Row className="weui-cell">
                                                <Row className="weui-cell__bd">
                                                    {this.state.opinionData.realName}
                                                </Row>
                                            </Row>
                                        </Row>
                                        <Row className="box-title-line box-title">提出时间</Row>
                                        <Row className="cell-border">
                                            <Row className="weui-cell">
                                                <Row className="weui-cell__bd">
                                                    {this.state.opinionData.createTime}
                                                </Row>
                                            </Row>
                                        </Row>
                                        <Row className="box-title-line box-title">意见内容</Row>
                                        <Row className="cell-border">
                                            <Row className="weui-cell">
                                                <Row className="weui-cell__bd" style={{ width: "100%", overflow: "hidden", wordBreak: "break-all" }}>
                                                    {this.state.opinionData.opinions}
                                                </Row>
                                            </Row>
                                        </Row>
                                    </Row>
                                </Row>
                            ) :
                            (
                                this.state.safetySceneData !== null && this.state.safetySceneData.status !== 5 && this.state.safetySceneData.inspectConditionId !== 0 ?
                                    (
                                        <Row>
                                            <Row className="card-txt">
                                                <Col style={{ margin: 'auto 0' }}>
                                                    <img className="dot" src={require("../img/dot.png")} />
                                                </Col>
                                                <Col className="cell-padding" style={{ fontWeight: "bold" }}>
                                                    处理意见：</Col>
                                            </Row>
                                            <Row className="record-item-box deal-item-box opinion-input">
                                                <TextArea placeholder="请输入处理意见" autosize onChange={(e) => { this.inputChangeHandle(e) }} />
                                            </Row>
                                        </Row>
                                    ) : null
                            )
                    }
                    {
                        this.state.safetySceneData !== null && this.state.safetySceneDealData !== null && this.state.safetySceneData.status === 5 ?
                            (
                                <Row>
                                    <Row className="card-txt">
                                        <Col style={{ margin: 'auto 0' }}>
                                            <img className="dot" src={require("../img/dot.png")} />
                                        </Col>
                                        <Col className="cell-padding">
                                            处理情况：</Col>
                                    </Row>
                                    <Row className="record-item-box">
                                        <Row className="box-title-line box-title">处理时间</Row>
                                        <Row className="cell-border">
                                            <Row className="weui-cell">
                                                <Row className="weui-cell__bd">
                                                    {this.state.safetySceneData.modifyTime}
                                                </Row>
                                            </Row>
                                        </Row>
                                        <Row className="box-title-line box-title">处理人</Row>
                                        <Row className="cell-border">
                                            <Row className="weui-cell">
                                                <Row className="weui-cell__bd">
                                                    {this.state.safetySceneDealData.strDealUser}
                                                </Row>
                                            </Row>
                                        </Row>
                                        <Row className="box-title-line box-title">处理记录</Row>
                                        <Row className="cell-border">
                                            <Row className="weui-cell">
                                                <Row className="weui-cell__bd" style={{ width: "100%", overflow: "hidden", wordBreak: "break-all" }}>
                                                    {this.state.safetySceneDealData.dealContent}
                                                </Row>
                                            </Row>
                                        </Row>
                                        <Row className="box-title-line box-title">现场照片</Row>
                                        <Row className="background">
                                            <Row className="box-image">
                                                {dealImg.length !== 0 ?
                                                    dealImg :
                                                    (
                                                        <Col className="img-container">
                                                            <img className="myweui-uploader__img" src={require("../img/nophoto.png")} />
                                                        </Col>
                                                    )
                                                }
                                            </Row>
                                        </Row>
                                        <Row className="box-title-line box-title">评价情况</Row>
                                        <Row className="cell-border">
                                            <Row className="weui-cell">
                                                <Row className="weui-cell__bd">
                                                    {this.state.safetySceneDealData.evaluate === 0 ?
                                                        (<span>暂未评价</span>) :
                                                        (<Rate disabled defaultValue={this.state.safetySceneDealData.evaluate} />)
                                                    }
                                                </Row>
                                            </Row>
                                        </Row>
                                    </Row>
                                </Row>
                            ) : null
                    }
                    {this.state.safetySceneData && this.state.safetySceneData.status === 6 &&
                        <div>
                            <Row className="card-txt">
                                <Col style={{ margin: 'auto 0' }}>
                                    <img className="dot" src={require("../img/dot.png")} />
                                </Col>
                                <Col className="cell-padding">处理状态：</Col>
                            </Row>
                            <Row>
                                <div
                                    className="mywechat-btn"
                                    onClick={() => { this.handleChangeStatus() }}>任务已派发</div>
                            </Row>
                            <Row>
                                <div
                                    className="mywechat-btn"
                                    onClick={() => { this.handleChangeStatus() }} />
                                {this.state.isSendMessage ? (
                                    <div style={{
                                        fontSize: 18,
                                        textAlign: 'center',
                                        color: '#389e0d'
                                    }}>已将隐患处理转发至其他人员</div>
                                ) : (
                                        <MobileList>
                                            <div style={{ fontSize: 16, padding: '12px 0 0 8px' }}>若无法处理隐患，请转发给其他人员</div>
                                            <Picker
                                                data={pushUser}
                                                onOk={v => { this.handeleSendMessage(v[1]) }}
                                            >
                                                <MobileList.Item arrow="horizontal">选择人员</MobileList.Item>
                                            </Picker>
                                        </MobileList>
                                    )}

                            </Row>
                            <Alert style={{ marginTop: 12 }} message="若需处理隐患，请使用小程序操作" type="info" showIcon />
                        </div>
                    }
                </Card>
                {
                    this.state.opinionData !== null || (this.state.safetySceneData !== null &&
                        (this.state.safetySceneData.status === 5 || this.state.safetySceneData.inspectConditionId === 0)) ? null :
                        (
                            <Row className="page__ft btn-margin">
                                <div className="mywechat-btn" onClick={() => { this.submitClickHandle() }}>提交</div>
                            </Row>
                        )
                }
            </Row>
        );
    }
}

class Success extends Component {
    handleClick() {
        window.WeixinJSBridge.call('closeWindow'); //微信浏览器提供的方法 关闭页面
    }

    render() {
        return (
            <Layout style={{
                backgroundColor: "#ffffff",
                textAlign: "center",
                height: "100%"
            }}>
                <Content style={{
                    paddingTop: "56px"
                }}>
                    <IconFont
                        type="icon-locationiconsuccess"
                        style={{
                            marginBottom: "30px",
                            fontSize: "93px"
                        }} />
                    <h2 style={{
                        marginBottom: "5px",
                        fontWeight: "400",
                        fontSize: "20px"
                    }}>操作成功</h2>
                    <p style={{
                        fontSize: "14px",
                        color: "#808080"
                    }}>处理意见提交成功，请直接关闭此页面</p>
                    <div style={{
                        margin: "1.17647059em 15px 0.3em"
                    }}>
                        <div onClick={this.handleClick}
                            style={{
                                color: "#ffffff",
                                backgroundColor: "#1AAD19",
                                position: "relative",
                                display: "block",
                                marginLeft: "auto",
                                marginRight: "auto",
                                paddingLeft: "14px",
                                paddingRight: "14px",
                                boxSizing: "border-box",
                                fontSize: "18px",
                                textAlign: "center",
                                textDecoration: "none",
                                lineHeight: "2.55555556",
                                borderRadius: "5px"
                            }}>
                            关闭此页面
                        </div>
                    </div>
                </Content>
            </Layout>
        );
    }
}

export default DangerPush;